아이템20

다른 타입에는 다른 변수 사용

• 자바스크립트에서는 한 변수를 다른 목적을 가지는 다른 타입으로 재사용해도 된다. 하지만 타입스크립트에서는 오류가 발생한다.

//타입스크립트가 한 변수를 다른 목적을 가지는
//다른 타입으로 재사용했을 때 오류가 발생하는 예시
let id = "12-34-56";
fetchProduct(id);

id = 123456;
// ~~ '123456' 형식은 'string' 형식에 할당할 수 없습니다.
fetchProductBySerialNumber(id);
						// ~~ 'string' 형식의 인수는
						// 	  'number' 형식의 매개변수에 할당될 수 없습니다.

• 변수 값은 바껴도 타입은 바뀌지 않는다.

// 오류 해결 코드
let id: string|number = "12-34-56";
// ...

• 다만 이런 방식은 타입 확인이 요구되기 떄문에에
• 또 다른 변수 하나를 생성하는게 낫다.

별도의 변수 사용의 장점

• 서로 관련이 없는 두 개의 값을 분리

• 변수명을 더 구체적으로 지을 수 있음

• 타입 추론을 향상시키며, 타입 구문이 불필요

• 타입이 좀 더 간결해짐(string|number 대신 string과 number)

• let 대신 const 변수로 선언 -const 변수를 선언하면 코드가 간결해짐

• 타입 체커가 타입을 추론하기에도 좋음

• 많은 개발팀이 린터 규칙을 통해 '가려지는'변수를 사용하지 못하도록 하고 있음

❓ 가려지는 변수

내부 스코프에서 외부 스코프와 같은 이름의 변수를 선언할 때, 외부 스코프의 변수를 가려지게(shadowed) 되는 현상